import React from "react";
import { ProductCardProps } from "./type";

const ProductCard: React.FC<ProductCardProps> = ({ product }) => {
  if (!product) {
    return <>Product data is missing.</>;
  }

  const { brand, title, price, colors, size } = product;

  return (
    <>
      <h1 className="text-h1 font-bold text-textColor">{brand}</h1>
      <h3 className="text-h3 font-semibold text-textColor">{title}</h3>
      <h4 className="text-h4 font-regular text-textColor">{price.toLocaleString()} ₽</h4>
      <h5 className="text-h4 font-regular text-textColor">
        <b>Цвет:</b> {colors}
      </h5>
      <h4 className="text-h4 font-regular text-textColor">
        <b>Размер:</b> {size}
      </h4>
    </>
  );
};
export default ProductCard;
